<template>
  <view class="filling_List" v-for="item in orderLists" :key="item.id">
    <view class="filling_List_1">
      <text>订单号：{{ item.order_sn }}</text>
    </view>
    <view class="filling_List_1" style="margin: 15rpx 0px">
      <text>{{ item.fill_name }}</text>
      <text>{{ item.amount }}公斤</text>
    </view>
    <!--  <view class="filling_List_3">
        <view>{{ item.jieesuan_price }}元/公斤</view>
        <view ></view>
        <view>
          <text>消费金额￥</text>
          <text style="font-size: 30rpx;">{{ item.money }}</text>
        </view>
      </view> -->
    <view class="filling_List_3" style="margin-top: 50rpx">
      <view>{{ item.createtime }}</view>
      <view>
        <text style="margin-left: 20rpx">{{ item.cart_code }}</text>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
/**
 * @component
 * @desc 订单列表
 * @property {Array} orderLists 订单列表
 * @property {Boolean} status  是否显示订单状态
 * @property {String} acc_id  车主ID
 * @property {String} accountID 授权账户id
 */

import { PropType } from 'vue';

defineProps({
  orderLists: {
    type: Array as PropType<Array<any>>,
    default: () => [],
  },
});
</script>

<style scoped lang="less">
.filling_List:nth-of-type(1) {
  margin-top: 0px;
}

.filling_List {
  width: 95%;
  margin: 2.5%;
  padding: 20rpx 30rpx;
  box-sizing: border-box;
  background-color: white;
  box-shadow: 0px 2px 23px 1px rgba(204, 204, 204, 0.3);
  border-radius: 5px;
  position: relative;
  overflow: hidden;

  .fill_text {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 119rpx;
    height: 54rpx;
    background: linear-gradient(-24deg, #fe9b00, #ffbd56);
    border-radius: 0rpx 0px 0px 5px;
    text-align: center;
    line-height: 54rpx;
    font-size: 30rpx;
    font-family: PingFang SC;
    font-weight: 400;
    color: #ffffff;
  }

  .filling_List_1 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;

    text {
      font-size: 32rpx;
      font-family: PingFang SC;
      font-weight: 400;
      color: #333333;
    }
  }

  .filling_List_3 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;

    view:nth-of-type(1) {
      font-size: 26rpx;
      font-family: PingFang SC;
      font-weight: 400;
      color: #333333;
    }

    view:nth-of-type(2) {
      display: flex;
      align-items: center;
      justify-content: flex-end;

      text {
        font-size: 26rpx;
        font-family: PingFang SC;
        font-weight: 400;
        color: #333333;
      }
    }
  }
}
</style>
